<template>
  <div>
    <r-search
      :searchForm="searchForm"
      :searchHandle="searchHandle"
      :searchData="searchData"
    />
    <r-table
      :isSelection="true"
      :isIndex="true"
      :isPagination="true"
      :tableData="tableData"
      :tableCols="tableCols"
      :tablePage="tablePage"
      @refresh="init()"
    ></r-table>
  </div>
</template>
<script>
export default {
  data() {
    return {
      searchData: {
        orderNo: "",
        replenishName: "",
        equipmentNo: "",
        phone: "",
        type: 3
      },
      searchForm: [
        {
          type: "input",
          prop: "orderNo",
          placeholder: "工单编号",
          width: 150
        },
        {
          type: "input",
          prop: "replenishName",
          placeholder: "补货员Name",
          width: 170
        },
        {
          type: "input",
          prop: "equipmentNo",
          placeholder: "Device Number",
          width: 170
        },
        {
          type: "input",
          prop: "phone",
          placeholder: "联系方式",
          width: 170
        }
      ],
      searchHandle: [
        {
          label: "Search",
          type: "success",
          icon: "el-icon-search",
          handle: e => this.init()
        },
        {
          label: "Reset",
          icon: "el-icon-refresh-right",
          handle: e => this.searchFromReset()
        }
      ],
      tableData: [],
      tableCols: [
        {
          label: "工单编号",
          prop: "id"
          // theme: e => e.status ? 'primary' : 'danger', type: "tag",
        },

        {
          label: "Device Number",
          prop: "equipmentNo"
        },
        {
          label: "补货员",
          prop: "replenishName"
        },
        {
          label: "电话号码",
          prop: "phone"
        },
        {
          label: "称编号",
          prop: "trayNo"
        },
        {
          label: "补货前商品",
          prop: "goodsOldName"
        },
        {
          label: "补货后商品",
          prop: "goodsNewName"
        },
        {
          label: "补货时间",
          prop: "ctime",
          width: 160,
          formatter: e =>
            e.ctime && this.getDeta(+new Date(e.ctime.replace(/T/g, " ")))
        }
      ],
      tablePage: { limit: 10, page: 1, total: 0 }
    };
  },
  components: {},
  computed: {},
  mounted() {
    this.init();
  },
  methods: {
    async init() {
      let param = { ...this.searchData, ...this.tablePage };
      let res = await this.api.replenishRepChange(param);
      if (res) {
        this.tableData = res.data.list;
        this.tablePage.total = res.data.total;
      }
    }
  }
};
</script>
<style scoped lang="scss">
.el-icon-search {
  margin-right: 10px;
}
.Tip {
  margin-left: 20px;
}
</style>
